<!DOCTYPE html >
<html>
<head>
    <title>Scatterplot Representation-Highcharts QBuilder</title>
    
    <script type="text/javascript" src="{{ MEDIA_URL }}qbuilder/jquery-1.6.2.min.js" ></script>
    <script type="text/javascript" src="{{ MEDIA_URL }}qbuilder/Highcharts/highcharts.js" ></script>
    <script type="text/javascript" src="{{ MEDIA_URL }}qbuilder/Highcharts/modules/exporting.js" ></script>
    <script type="text/javascript" src="{{ MEDIA_URL }}qbuilder/Highcharts/themes/grid.js"></script>

    <script type="text/javascript">
        var chart;
        $(document).ready(function() {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container', 
                    defaultSeriesType: '{{ graph_type }}',
                },
                credits: {
                    enabled: false,
                },
	        navigation: {
	            buttonOptions: {
	                enabled: false,
                    },
                },
                title: {
                    text: '{{ title_text }}',
                },
                xAxis: {
                    type: '{{ xAxis_type|default:"linear" }}',
                },
                yAxis: {
                    type: '{{ yAxis_type|default:"linear" }}',
                    min: {{ yAxis_min|default:"null" }},
                    max:  {{ yAxis_max|default:"null" }},
                    title: {
                        text: '{{ yAxis_title_text }}'
                    }
                },
                tooltip: {
                    formatter: function() {
                        return '{{ tooltip_formatter|safe|default:""}}';
                    }
                },
                plotOptions: {{ plotOptions|safe|default:"[]" }},
                series: [{
                    name: 'Status: 0',
                    data:[
	[Date.UTC(2011, 6, 1), 11], [Date.UTC(2011, 6, 2), 12],
	[Date.UTC(2011, 6, 3), 12], [Date.UTC(2011, 6, 4), 12],
	[Date.UTC(2011, 6, 5), 12], [Date.UTC(2011, 6, 6), 12],
        [Date.UTC(2011, 6, 7), 10], [Date.UTC(2011, 6, 8), 9],
	[Date.UTC(2011, 6, 9), 11], [Date.UTC(2011, 6, 10), 6],
	[Date.UTC(2011, 6, 11), 6], [Date.UTC(2011, 6, 12), 6],
        [Date.UTC(2011, 6, 13), 4], [Date.UTC(2011, 6, 14), 4],
	[Date.UTC(2011, 6, 15), 4], [Date.UTC(2011, 6, 16), 9],
	[Date.UTC(2011, 6, 17), 9], [Date.UTC(2011, 6, 18), 9],
        [Date.UTC(2011, 6, 19), 14], [Date.UTC(2011, 6, 20), 14],
	[Date.UTC(2011, 6, 21), 14], [Date.UTC(2011, 6, 22), 19],
	[Date.UTC(2011, 6, 23), 19], [Date.UTC(2011, 6, 24), 22],
        [Date.UTC(2011, 6, 25), 14], [Date.UTC(2011, 6, 26), 13],
	[Date.UTC(2011, 6, 27), 16], [Date.UTC(2011, 6, 28), 12],
	[Date.UTC(2011, 6, 29), 13], [Date.UTC(2011, 6, 30), 13],
	[Date.UTC(2011, 6, 31), 14]
	                 ]
               }, {
                    name: 'Status: 1',
                    data: [
	[Date.UTC(2011, 6, 1), 14], [Date.UTC(2011, 6, 2), 13],
	[Date.UTC(2011, 6, 3), 12], [Date.UTC(2011, 6, 4), 14],
	[Date.UTC(2011, 6, 5), 13], [Date.UTC(2011, 6, 6), 14],
        [Date.UTC(2011, 6, 7), 11], [Date.UTC(2011, 6, 8), 12],
	[Date.UTC(2011, 6, 9), 13], [Date.UTC(2011, 6, 10), 6],
	[Date.UTC(2011, 6, 11), 6], [Date.UTC(2011, 6, 12), 8],
        [Date.UTC(2011, 6, 13), 5], [Date.UTC(2011, 6, 14), 4],
	[Date.UTC(2011, 6, 15), 5], [Date.UTC(2011, 6, 16), 11],
	[Date.UTC(2011, 6, 17), 10], [Date.UTC(2011, 6, 18), 11],
        [Date.UTC(2011, 6, 19), 16], [Date.UTC(2011, 6, 20), 15],
	[Date.UTC(2011, 6, 21), 16], [Date.UTC(2011, 6, 22), 21],
	[Date.UTC(2011, 6, 23), 19], [Date.UTC(2011, 6, 24), 24],
        [Date.UTC(2011, 6, 25), 18], [Date.UTC(2011, 6, 26), 16],
	[Date.UTC(2011, 6, 27), 20], [Date.UTC(2011, 6, 28), 15],
	[Date.UTC(2011, 6, 29), 14], [Date.UTC(2011, 6, 30), 13],
	[Date.UTC(2011, 6, 31), 14]
	                  ]
               }, {
                    name: 'Status: 2',
                    data: [
	[Date.UTC(2011, 6, 1), 20], [Date.UTC(2011, 6, 2), 19],
	[Date.UTC(2011, 6, 3), 20], [Date.UTC(2011, 6, 4), 19],
	[Date.UTC(2011, 6, 5), 19], [Date.UTC(2011, 6, 6), 19],
        [Date.UTC(2011, 6, 7), 16], [Date.UTC(2011, 6, 8), 16],
	[Date.UTC(2011, 6, 9), 18], [Date.UTC(2011, 6, 10), 10],
	[Date.UTC(2011, 6, 11), 9], [Date.UTC(2011, 6, 12), 12],
	[Date.UTC(2011, 6, 13), 6], [Date.UTC(2011, 6, 14), 6],
	[Date.UTC(2011, 6, 15), 6], [Date.UTC(2011, 6, 16), 15],
	[Date.UTC(2011, 6, 17), 14], [Date.UTC(2011, 6, 18), 15],
        [Date.UTC(2011, 6, 19), 24], [Date.UTC(2011, 6, 20), 23],
	[Date.UTC(2011, 6, 21), 29], [Date.UTC(2011, 6, 22), 28],
	[Date.UTC(2011, 6, 23), 29], [Date.UTC(2011, 6, 24), 36],
        [Date.UTC(2011, 6, 25), 22], [Date.UTC(2011, 6, 26), 24],
	[Date.UTC(2011, 6, 27), 32], [Date.UTC(2011, 6, 28), 21],
	[Date.UTC(2011, 6, 29), 20], [Date.UTC(2011, 6, 30), 21],
	[Date.UTC(2011, 6, 31), 22]]
               }]
           });  
       });
    </script>
</head>
<body>
    <div id="container" style="height:480px; margin: 0 2em; min-width: 620px">
</body>
</html>
